<template>
  <el-tabs v-model="activeName" @tab-click="handleClick">
    <el-tab-pane :label="tab.name" :name="tab.value" v-for="(tab, index) in tabList" :key="index">
      <component :is="tab.component" />
    </el-tab-pane>
  </el-tabs>
</template>
<script setup>
import { ref, computed } from 'vue';
import MyStockTable from '../components/MyStockTable.vue';
import BomRecord from '../components/BomRecord.vue';
import MailRecord from '../components/MailRecord.vue';
import { useRoute } from 'vue-router';
import { useI18n } from 'vue-i18n';
const { t } = useI18n();
const route = useRoute();
const clickTab = Number(route.query.childrenType) ? Number(route.query.childrenType) : 1;

const activeName = ref(clickTab);

const tabList = computed(() => [
  {
    name: '我的库存',
    value: 1,
    component: MyStockTable,
  },
  {
    name: t('om.bompreparation'),
    value: 2,
    component: BomRecord,
  },
  {
    name: '邮寄记录',
    value: 3,
    component: MailRecord,
  },
]);
</script>
